<template>
	<div>
		<Row style="text-align: left;margin-top: 41px;">
			<Col span="12" style="text-align: left;">
			<span style="border-left: 5px solid #517EDB;font-size: 16px;"></span>
			<span style="font-size: 16px;font-weight: 800;margin-left: 41px;">选科信息</span>
			</Col>
		</Row>
		<Row style="margin-left:45px;margin-top: 20px; padding: 15px 0; width: 40%; background-color: #B3D4FC;">
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;font-weight: 700;">学生：</span>
			<span style="font-size: 14px;">{{xkpkname}}</span>
			</Col>
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;font-weight: 700;">班级：</span>
			<span style="font-size: 14px;">{{xkpkclass}}</span>
			</Col>
			<Col span="24" style="text-align: center;width: 33.3%;">
			<span style="font-size: 14px;font-weight: 700;">学号：</span>
			<span style="font-size: 14px;">{{xkpknum}}</span>
			</Col>
		</Row>
		<Row style="padding:35px 40px 0px 45px;width: 80%;">
			<Col span="24" style="text-align: left;width: 15%;">
			<span style="font-size: 14px;font-weight: 700;">入学年份：</span>
			<span style="font-size: 14px;">{{xkpkyear}}</span>
			</Col>
			<Col span="24" style="text-align: left;width: 15%;">
			<span style="font-size: 14px;font-weight: 700;">校&nbsp;&nbsp;&nbsp;&nbsp;区：</span>
			<span style="font-size: 14px;">{{xkpkschool}}</span>
			</Col>
			<Col span="24" style="text-align: left;width: 15%;">
			<span style="font-size: 14px;font-weight: 700;">年&nbsp;&nbsp;&nbsp;&nbsp;级：</span>
			<span style="font-size: 14px;">{{xkpkgrade}}</span>
			</Col>
			<Col span="24" style="text-align: left;width: 30%;">
			<span style="font-size: 14px;font-weight: 700;">起止时间：</span>
			<span style="font-size: 14px;">{{xkpkstarttime}}至{{xkpkendtime}}</span>
			</Col>
		</Row>
		<Row style="margin:35px 40px 0px 45px;width: 70%; border: 1px solid #CCCCCC;">
			<RadioGroup style="padding: 20px;width: 100%; " v-model="subradio" type="button" >
				<Radio style="display: inline-block;padding: 0px; float: left;width: 16%;margin: 10px 2%;border: 1px solid #CCCCCC;" v-for="item in subList" :key="item.label" :label="item.label">
					{{item.label}}
				</Radio>
			</RadioGroup>
			<Row style="margin:0  20px; border-top:1px solid #CCCCCC ;">
				<Col>
				<span style="float: left;padding: 20px 20px; font-size: 14px;">您的选科结果：{{subradio}}</span>
				</Col>
				<Button  @click="confirm=true" style="margin-left: 40px;float: right;margin: 20px;" size="large" type="primary">确定</Button>
			</Row>
		</Row>
		
		<Modal title="提示" v-model="confirm" :closable="false"  class-name="vertical-center-modal" @on-ok="save" @on-cancel="cancelmodel">
					<p>确定选择{{subradio}}吗？</p>
				</Modal>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				confirm:false,
				subradio: "物理、化学、生物",
				radiolabel: "",
				xkpkname: "吴俊辰",
				xkpkclass: "高二(1)班",
				xkpknum: "973636236",
				xkpkyear: "2018",
				xkpkschool: "本部",
				xkpkgrade: "高二",
				xkpkstarttime: "2018-06-21",
				xkpkendtime: "2018-06-27",
				subList: [{
						value: 1,
						label: "物理、化学、生物"
					},
					{
						value: 2,
						label: "物理、化学、政治"
					},
					{
						value: 3,
						label: "物理、化学、地理"
					},
					{
						value: 4,
						label: "物理、化学、历史"
					},
					{
						value: 5,
						label: "物理、生物、政治"
					},
					{
						value: 6,
						label: "物理、生物、历史"
					},
					{
						value: 7,
						label: "物理、生物、地理"
					},
					{
						value: 8,
						label: "化学、历史、生物"
					},
					{
						value: 9,
						label: "政治、化学、生物"
					},
					{
						value: 10,
						label: "地理、化学、生物"
					}
				],
			}
		},
		methods: {
			save:function(){
				alert("保存成功")
				this.confirm=false
			},
			cancelmodel:function(){
				this.confirm=false
			}
		}

	}
</script>

<style>

</style>